import { useSafeAreaInsets } from 'react-native-safe-area-context';
import { Easing, withTiming, useAnimatedStyle } from 'react-native-reanimated';
import { WINDOW_HEIGHT, SCREEN_HEIGHT, SCREEN_WIDTH } from '@/utils/resize';
import type { DirectionType } from './types';
import { isIos } from '@/utils/helper';

type Options = {
  open: boolean;
  duration: number;
  type: DirectionType;
  centerCloseZoom?: number;
}

export const easing = Easing.bezier(.4, 0, .22, 1);

export const useAnimateStyle = (options: Options) => {
  const { open, type, duration, centerCloseZoom = 1.1 } = options;
  const config = { duration, easing };

  return useAnimatedStyle(() => {
    let scale = 1;
    let opacity = 1;
    let translateX: any = 0;
    let translateY: any = 0;

    switch (type) {
      case 'center': {
        opacity = open ? 1 : 0;
        scale = open ? 1 : centerCloseZoom;
        break;
      }
      case 'left': {
        translateX = open ? 0 : '-100%';
        break;
      }
      case 'right': {
        translateX = open ? 0 : '100%';
        break;
      }
      case 'top': {
        translateY = open ? 0 : '-100%';
        break;
      }
      case 'bottom': {
        translateY = open ? 0 : '100%';
        break;
      }
    }

    return {
      opacity: withTiming(opacity, config),
      transform: [
        { scale: withTiming(scale, config) },
        { translateX: withTiming(translateX, config) },
        { translateY: withTiming(translateY, config) }
      ]
    }
  });
}

export const useHeight = () => {
  const { top } = useSafeAreaInsets();
  return [isIos() ? SCREEN_HEIGHT : WINDOW_HEIGHT + top];
}

export const useContentStyle = (type: DirectionType) => {
  const [height] = useHeight();

  switch (type) {
    case 'top':
    case 'bottom': {
      return {
        width: SCREEN_WIDTH
      }
    }
    case 'center': {
      return {
        maxWidth: SCREEN_WIDTH,
        maxHeight: height
      }
    }
    case 'right':
    case 'left': {
      return {
        height: SCREEN_HEIGHT
      }
    }
  }
}